const gulp = require('gulp');
const rename = require('gulp-rename');
const js = require('gulp-uglify');
const css = require('gulp-minify-css');
const cssClean = require('gulp-clean-css');
const html = require('gulp-minify-html');
const imagemin = require('gulp-imagemin');
const concat = require('gulp-concat');
const less = require('gulp-less');
const watch = require('gulp-watch');
const browserSync = require('browser-sync').create();

// watch监听
gulp.task('watch', done => {
    watch('src/index.html', () => {
        gulp.start('html');	//执行html任务
        /*browserSync.reload(); //刷新浏览器*/
    });
    done();
});
// js文件压缩
gulp.task('minify-js', done => {
    gulp.src('src/js/app/*.js') // 要压缩的js文件
        .pipe(concat('all.js')) // 合并所有js文件并命名
        .pipe(gulp.dest('dist/js')) // 临时输出文件到本地
        .pipe(js())  //使用uglify进行压缩,更多配置请参考：
        .pipe(rename({suffix: '.min'})) // 所有js重命名
        .pipe(gulp.dest('dist/js')); //压缩后的路径
    done();
});
// css文件压缩
gulp.task('minify-css', done => {
    gulp.src('src/css/app/*.css') // 要压缩的js文件
        .pipe(css())  //使用uglify进行压缩,更多配置请参考：
        .pipe(rename({suffix: '.min'})) // 所有css重命名
        .pipe(cssClean({compatibility: 'ie8'})) // 兼容到ie8
        .pipe(gulp.dest('dist/css')); //压缩后的路径
    done();
});
// html文件压缩
gulp.task('minify-html', done => {
    gulp.src('src/*.html') // 要压缩的js文件
        .pipe(html({
            collapseWhitespace: true,//空白缩进
            removeComments: true//删除评论
        }))  //使用uglify进行压缩,更多配置请参考：
        .pipe(gulp.dest('dist/'))  //压缩后的路径
        .pipe(browserSync.reload({ //通知浏览器重新加载
           stream: true
        }));
    done();
});
// images文件压缩
gulp.task('images', done => {
     gulp.src('src/images/*')
        .pipe(imagemin([
            imagemin.gifsicle({interlaced: true}),
            imagemin.jpegtran({progressive: true}),
            imagemin.optipng({optimizationLevel: 5}),
            imagemin.svgo({
                plugins: [
                    {removeViewBox: true},
                    {cleanupIDs: false}
                ]
            })
        ]))
        .pipe(gulp.dest('dist/images'));
    done();
});
// less编译
gulp.task('compile-less', done => {
    gulp.src('src/less/*.less')
        .pipe(less())
        .pipe(gulp.dest('dist/css'));
    done();
});
// 文件重命名
gulp.task('rename', done => {
    gulp.src('src/js/lib/bootstrap.js')
        .pipe(rename('bootstrap.min.js')) //会将jquery.js重命名为jquery.min.js
        .pipe(gulp.dest('dist/js'));
    gulp.src('src/css/app/*.css')
        .pipe(css()) // 压缩
        .pipe(rename({
            suffix: '.min'
        })) //会将所有css重命名为.min.css
        .pipe(gulp.dest('dist/css'));
    done();
});
// 合并文件
gulp.task('concat', done => {
    gulp.src(['dist/js/index.js', 'dist/js/bootstrap.js'])  //要合并的文件
        .pipe(concat('index-all.js'))  // 合并匹配到的js文件并命名为 "all.js"
        .pipe(gulp.dest('dist/js'));
    done();
});
// 浏览器监监视任务
gulp.task('watch',  gulp.series('minify-js', 'minify-css'), done => {
    browserSync.reload();
    done()
} );
gulp.task('serve', done => {
    browserSync.init({
        server: {
            baseDir: '/'
        }
    });
    gulp.watch(gulp.series['./src/css/*.css', './src/js/*.js', './src/*.html'], gulp.series['watch']);
    done();
});



gulp.task('default', gulp.series('minify-js', 'minify-css', 'minify-html', 'images', 'compile-less', 'rename'), done => {
    done()
});